<template>
	<view class="page">

		<view class="box">
			<Index v-show="component == 'index'" class="box"></Index>
			<!-- 数据 -->
			<Exhibition v-if="component == 'exhibition'" class="box"></Exhibition>
			<!-- 我的 -->
			<My ref="my" :userInfo="userInfo" v-show="component == 'my'" class="box"></My>
		</view>
		<!-- <up-gap height="80"></up-gap> -->
		<up-tabbar :value="tabbarCurrent" @change="change" fixed placeholder safeAreaInsetBottom activeColor="#51D580">
			<!-- <up-tabbar-item text="首页" icon="home"></up-tabbar-item> -->
			<up-tabbar-item text="首页">
				<template #active-icon>
					<image class="u-page__item__slot-icon" src='../../static/tab_icon_4.png'
						style="width: 60rpx; height: 60rpx;"></image>
				</template>
				<template #inactive-icon>
					<image class="u-page__item__slot-icon" src='../../static/tab_icon_1.png'
						style="width: 60rpx; height: 60rpx;"></image>
				</template>
			</up-tabbar-item>
			<up-tabbar-item text="音标">
				<template #active-icon>
					<image class="u-page__item__slot-icon" src='../../static/tab_icon_5.png'
						style="width: 60rpx; height: 60rpx;"></image>
				</template>
				<template #inactive-icon>
					<image class="u-page__item__slot-icon" src='../../static/tab_icon_2.png'
						style="width: 60rpx; height: 60rpx;"></image>
				</template>
			</up-tabbar-item>
			<up-tabbar-item text="我的">
				<template #active-icon>
					<image class="u-page__item__slot-icon" src='../../static/tab_icon_6.png'
						style="width: 60rpx; height: 60rpx;"></image>
				</template>
				<template #inactive-icon>
					<image class="u-page__item__slot-icon" src='../../static/tab_icon_3.png'
						style="width: 60rpx; height: 60rpx;"></image>
				</template>
			</up-tabbar-item>
			<!-- 	<up-tabbar-item text="音标" icon="calendar"></up-tabbar-item>
			<up-tabbar-item text="我的" icon="account"></up-tabbar-item> -->
		</up-tabbar>
	</view>

</template>

<script setup>
	import {
		inject,
		ref,
		provide,
		onMounted,
		nextTick
	} from 'vue'
	import {
		onLoad,
		onShareAppMessage,
		onShow
	} from '@dcloudio/uni-app'
	const loginWordCodeApi = inject('loginWordCode');
	const getUserInfoApi = inject('getUserInfo');
	const userInfo = ref({});
	const my = ref(null)
	// userInfo.value = uni.getStorageSync('userInfo');

	// const loginParam = inject('loginParam')
	// console.log(loginParam,'loginParamloginParamloginParam')
	onShareAppMessage((res) => {
		if (res.from === 'button') { // 来自页面内分享按钮
			console.log(res.target)
		}
		return {
			title: '',
			content: '我正在使用百霸智育学习，赶紧跟我一起来体验！',
			path: '/pages/index/index',
			imageUrl: 'http://bbsf.oss-cn-shanghai.aliyuncs.com/english/icons/shareBj.png'
		}
	})
	const loginWordCode = () => {
		let param = uni.getStorageSync('loginParam');
		getUserInfoApi().then(res => {
			console.log(res, my.value, 'my.valuemy.valuemy.value')
			uni.setStorageSync('userInfo', res)
			userInfo.value = res
			nextTick(() => {
				if (my.value) {
					my.value.setUserInfo(res)
				}
			})
		})


	};

	onShow(() => {
		console.log('onShowonShowonShowonShow')
		// userInfo.value = uni.getStorageSync('userInfo');
		// loginWordCode()
	})
	// onMounted(()=>{
	// 	if(my.value){
	// 		my.value.setUserInfo(userInfo.value)
	// 		console.log()
	// 	}
	// })
	const component = ref('index');
	const title = ref('');
	// const title = ref('');
	const tabbarCurrent = ref(0);
	const tabbarKey = ref({
		keys: ['index', 'exhibition', 'my'],

	})
	const change = (index) => {
		// 不管是否切换都更新个人信息
		// console.log('index', index)
		if (index == 2) {
			// loginWordCode();
		}
		if (tabbarCurrent.value == index) return
		if (index == 2) {
			title.value = ''
		} else {
			title.value = ''
		}
		tabbarCurrent.value = index
		component.value = tabbarKey.value.keys[index]
		pageInit()
	}
	const pageInit = () => {
		// console.log(component.value)

	}
</script>

<style lang="scss" scoped>

</style>